import React, { type FC } from 'react'
import { NavBar, Toast } from 'react-vant';
import { useHistory, type RouteComponentProps } from 'react-router-dom';
import { ArrowLeft } from '@react-vant/icons';

//封装返回组件 动态标题 返回上一页功能
/*
获取路由信息对象
1.通过Route配置的组件 props自带路由 信息对象
2.没有通过Route配置的组件:
 2-1 使用withRouter包裹组件  props.history.go(-1)
 2-2 使用useHistory  let history = useHistory()  history.go(-1)
*/

//给props 定义 父子数据 extends 继承(解决history报错)
interface Iprops{
    title: string,
    leftText?: boolean
}

function Myback(props: Iprops) {

    let { title, leftText } = props
    let history = useHistory()

    return (
        <div>
            <NavBar
                title={title}
                leftText={leftText ? "返回" : ''}
                leftArrow={leftText ? <ArrowLeft /> : null}
                //leftArrow={leftText ? <span>{'<'}</span> : ''}
                onClickLeft={() => {
                    //props.history.go(-1)
                    history.go(-1)
                }}
            />
        </div>
    )
}

export default Myback
